<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8"/>
    <title>互助金服-租房</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link href="${ctx}/static/css/bootstrap.css" rel="stylesheet" type="text/css"/>
    <link href="${ctx}/static/validator/bootstrapValidator.min.css" rel="stylesheet" type="text/css"/>
    <link href="${ctx}/static/tip/banneralert.css" rel="stylesheet" type="text/css"/>
    <link href="${ctx}/static/css/style.css" rel="stylesheet" type="text/css"/>
    <style>
        .cover {
            display: none;
            position: fixed;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            z-index: 10000;
            background-color: #101010;
            opacity: 0.95;
            padding-bottom: 15px;
        }
    </style>
</head>
<body lang="zh-CN">
<div class="zufang-block">
    <img class="zufang-bg img-responsive" src="${ctx}/static/img/other/bg.png"/>

    <form action="#" method="post" class="zufang-form form-horizontal" style="padding: 20% 0 7% 0">

        <div class="form-group">
            <label class="form-label">姓名</label>
            <input name="name" class="form-input span8" type="text" placeholder="请输入姓名" required
                   data-bv-notempty-message="姓名不能为空"/>
        </div>
        <%--<div class="form-group">
            <label class="form-label">身份证号</label>
            <input name="idNo" class="form-input span8" type="text" placeholder="请输入身份证号"
                   required data-bv-notempty-message="身份证号不能为空"
                   pattern="(^\d{15}$)|(^\d{17}([0-9]|X)$)"/>
        </div>--%>
        <div class="form-group">
            <label class="form-label">手机号码</label>
            <input id="mobileNo" name="mobileNo" class="form-input span8" type="tel" placeholder="请输入手机号码"
                   required data-bv-notempty-message="手机号不能为空"
                   pattern="^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$"
                   data-bv-regexp-message="手机号码格式不正确"/>
        </div>
        <%--<div class="form-group">
            <label class="form-label">租房地址</label>
            <input name="address" class="form-input span8" type="text" placeholder="请输入租房地址" required
                   data-bv-notempty-message="租房地址不能为空"/>
        </div>
        <div class="form-group">
            <label class="form-label">月租金</label>
            <input name="rent" class="form-input span8" type="number" placeholder="" pattern="^[0-9]+(.[0-9]{2})?$"/>
            <span class="form-float">元/月</span>
        </div>
        <div class="form-group">
            <label class="form-label">交租时间</label>
            <input id="rentDate" name="rentDate" class="form-input span8" type="date" style="line-height: normal"/>
					<span class="form-float">
						<img src="${ctx}/static/img/other/calendar.png"/>
					</span>
        </div>
        <div class="form-group">
            <label class="form-label">付款方式</label>
            <select name="paymentMethod" class="form-select span8">
                <option value="10">押一付三</option>
                <option value="20">押一付二</option>
                <option value="30">押一付六</option>
                <option value="40">押二付二</option>
            </select>
        </div>--%>

        <div class="form-group">
            <label class="form-label">每月收入</label>
            <input name="income" class="form-input span8" placeholder="工资收入"
                   required data-bv-notempty-message="每月收入不能为空"
                   pattern="^[0-9]+(.[0-9]{2})?$"
                   data-bv-regexp-message="金额格式不正确"
                   min="100"
                   data-bv-greaterthan-inclusive="false"
                   data-bv-greaterthan-message="金额不能少于100"
                    />
            <span class="form-float">元/月</span>
        </div>
        <div class="form-group">
            <label class="form-label">每月支出</label>
            <input name="expense" class="form-input span8" placeholder="车贷/房贷/信用卡等固定支出" pattern="^[0-9]+(.[0-9]{2})?$" required
                   data-bv-notempty-message="每月支出不能为空"
                   data-bv-regexp-message="金额格式不正确"
                   min="0"
                   data-bv-greaterthan-inclusive="false"
                   data-bv-greaterthan-message="金额不能小于0"
                    />
            <span class="form-float">元/月</span>
        </div>
        <div class="form-group">
            <label class="form-label">推荐人</label>
            <input name="referrer" class="form-input span8" type="text" placeholder="手机号码"/>
        </div>
        <div class="form-group">
            <label class="form-label">验证码</label>
            <input name="verifyCode" class="form-input span4" type="text" required data-bv-notempty-message="验证码不能为空"/>
            <button id="securityCode" type="button" class="btn span3">获取验证码</button>
        </div>

        <div class="form-group" style="padding-left: 20%">
            <button id="submitBtn" style="width: 80%;margin-left: 0" class="btn">立即申请</button>
            <p style="font-size: 1.25em;">（暂只支持厦门区域申请）</p>
        </div>

        <input type="hidden" name="openid" value="${openId}"/>
        <input type="hidden" name="fromAcivityFlag" value="${fromAcivityFlag}"/>
    </form>
</div>
<div id="activityTip" class="cover">
    <img style="width: 100%;" src="${ctx}/static/img/activity/rentApply.png">
</div>
<%--<div id="successTip" class="cover" style="text-align: center;">--%>
    <%--<img style="width: 80%;margin-top: 20%" src="${ctx}/static/img/activity/rentApply_success.png">--%>
<%--</div>--%>
<div class="weui_dialog_alert" id="claimSuccessTip" style="display: none;">
    <div class="weui_mask"></div>
    <div class="weui_dialog">
        <div class="weui_dialog_hd"><strong class="weui_dialog_title">领取白条成功！</strong></div>
        <div class="weui_dialog_bd" style="text-align: center">
            <h4>工作人员将在3个工作日内与您联系或直接致电400-8585-685</h4>
        </div>
        <div class="weui_dialog_ft">
            <a href="javascript:void(0);" id="tipConfirm" class="weui_btn_dialog primary">确定</a>
        </div>
    </div>
</div>
<!-- Main END -->
<link href="${ctx}/static/sweetalert/sweetalert.css" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" type="text/css" href="${ctx}/static/weui/css/weui.min.css"/>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="${ctx}/static/sweetalert/sweetalert.min.js"></script>
<script type="text/javascript" src="${ctx}/static/validator/bootstrapValidator.min.js"></script>
<script type="text/javascript" src="${ctx}/static/activity/cover.js"></script>
<script type="text/javascript">

    $(function () {
        $("#securityCode").on("click", securityCodeHandler);
        $("#submitBtn").on("click", submitHandler);
        $("#tipConfirm").on("click", tipConfirmHandler);

//        var date = new Date();
//        $("#rentDate").val(date.getFullYear()+'-'+(date.getMonth()+1)+"-"+date.getDate());

        $('form').bootstrapValidator();

        if(${fromAcivityFlag}){
            _system._cover("#activityTip");
        }
    });

    function tipConfirmHandler(){
        $("#claimSuccessTip").hide();
    }

    //验证码
    function securityCodeHandler() {
        var mobileNo = $("#mobileNo").val();

        if (!mobileNo) {
            return;
        }
        //请求验证码
        sendVerifyCode(mobileNo);

        var count = 300;
        $("#securityCode").attr("disabled", true);

        time();

        function time() {
            if (count == 0) {
                $("#securityCode")
                        .text("重新获取验证码")
                        .removeAttr("disabled");
            } else {
                $("#securityCode")
                        .text(count + "秒内输入");
                count--;
                setTimeout(time, 1000);
            }
        }
    }

    //提交
    function submitHandler() {
        var $submitBtn = $("#submitBtn");
        $submitBtn.attr("disabled", true);

        var $form = $("form");

        var validator = $form.data('bootstrapValidator').validate();

        if (!validator.isValid()) {
            $submitBtn.removeAttr("disabled");
            return;
        }

        $.post('/rent/rent/store',
                $form.serialize(),
                function (data) {
                    if (${fromAcivityFlag}){
                        if (data.resultCode == 1000) {
                            $("#claimSuccessTip").show();
                        } else {
                            swal(data.resultMsg);
                            $("#submitBtn").removeAttr("disabled");
                        }
                    } else {
                        if (data.resultCode == 1000) {
                            //_system._cover("#successTip");
                            location.replace('${ctx}/rent/applySuccess?id='+data.resultData.id);
                        } else {
                            swal(data.resultMsg);
                            $("#submitBtn").removeAttr("disabled");
                        }
                    }
                });

    }

    function sendVerifyCode(mobileNo) {
        $.post('/rent/rent/sendVerifyCode',
                {mobile: mobileNo},
                function (data) {

                });
    }
</script>
</body>
</html>
